import * as ElementPlusIconsVue from '@element-plus/icons-vue';
import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css';
import zhCn from 'element-plus/dist/locale/zh-cn.mjs';
import { createPinia } from 'pinia';
import { createPersistedState } from 'pinia-plugin-persistedstate';
import { createApp } from 'vue';
import App from './App.vue';
import './assets/css/main.css';
import './assets/scss/index.scss';
// 样式重置
import '@unocss/reset/normalize.css'
import 'virtual:uno.css'
import { setupI18n } from './hooks/useI18';
import router from './router';
import { usePermissionStore } from './store/permiss';
import storage from './utils/storage';
import directives from './directives';



const app = createApp(App);

// 注册elementplus图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component);
}
// 创建pinia持久化
app.use(createPinia().use(createPersistedState({

    key: (id) => `${storage.beforeKey}_${id}_${storage.afterKey}` 

})));

// 自定义权限指令
const permiss = usePermissionStore();
app.use(directives)



// Multilingual configuration
// 多语言配置
// Asynchronous case: language files may be obtained from the server side
// 异步案例：语言文件可能从服务器端获取
setupI18n(app);

// router && app.use(router);
console.log('router: ', router);
// app.use(ElementPlus,{locale: zhCn})
app.use(router)


app.mount('#app');
